<template>
  <div class="base-scene">
    <background-layout></background-layout>
    <operation-layout></operation-layout>
  </div>
</template>

<script setup lang="ts">
import _ from 'lodash'
import { ref, provide, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { DispatchResult } from '../../../tools'
import { RouteQuery } from '../../../tools/routeUtil'
import Api from '../../../components/tools/api'
import Message from '../../../components/message/index'
import BackgroundLayout from './backgroundLayout.vue'
import OperationLayout from './operationLayout.vue'

import SceneStore from './sceneStore'

defineOptions({
  name: 'game-base-scene'
})

const store = ref(new SceneStore())
const router = useRouter()
const idValue = _.toNumber(RouteQuery(router, 'id')) //文件id

const loadGame = async () => {
  try {
    let params = { id: idValue }
    let result = await Api.send(`/game/loadData`, params)
    DispatchResult(result, {
      onSuccess: (data: any) => {
        if (typeof data === 'object') {
          store.value.setData(data)
        }
      },
      onError: (_data: any, message: string) => {
        Message({ message, type: 'error' })
      }
    })
  } catch (error) {
    console.log(error)
  }
}

const gameStartBattle = async () => {
  try {
    let params = { id: idValue }
    router.replace(`/game/${idValue}/battle-scene`)
    let result = await Api.send(`/game/startBattle`, params)
    DispatchResult(result, {
      onSuccess: () => {
        router.replace(`/game/${idValue}/battle-scene`)
      },
      onError: (_data: any, message: string) => {
        Message({ message, type: 'error' })
      }
    })
  } catch (error) {
    console.log(error)
  }
}

const updateData = async (types: Array<string>) => {
  try {
    let params = { id: idValue, types }
    let result = await Api.send(`/game/loadPartData`, params)
    DispatchResult(result, {
      onSuccess: (data: any) => {
        store.value.setData(data)
      },
      onError: (_data: any, message: string) => {
        Message({ message, type: 'error' })
      }
    })
  } catch (error) {
    console.log(error)
  }
}

const gameBuyItem = async () => {
  try {
    let params = { saveid: idValue }
    let result = await Api.send(`/game/startBattle`, params)
    DispatchResult(result, {
      onSuccess: () => {
        router.replace(`/game/${idValue}/battle-scene`)
      },
      onError: (_data: any, message: string) => {
        Message({ message, type: 'error' })
      }
    })
  } catch (error) {
    console.log(error)
  }
}

const gameHireRole = async (roleid: any) => {
  try {
    let params = { saveid: idValue, roleid }
    console.log('gameHireRole', params)
    let result = await Api.send(`/game/hireRole`, params)
    DispatchResult(result, {
      onSuccess: () => {
        updateData(['HIREROLE', 'CHARACTER'])
      },
      onError: (_data: any, message: string) => {
        Message({ message, type: 'error' })
      }
    })
  } catch (error) {
    console.log(error)
  }
}

onMounted(async () => {
  await loadGame()
})

provide('store', store)

provide('gameEvents', {
  gameBuyItem,
  gameHireRole,
  gameStartBattle
})
</script>

<style lang="scss">
.base-scene {
  height: 100%;
  background-color: #999;
  position: relative;

  .background-layout {
    position: absolute;
    height: 100%;
    width: 100%;
  }
}
</style>
